<template>
  <el-dialog
    title="可可商城-用户协议"
    :visible.sync="dialogVisible"
    :before-close="cancel"
    top="30px"
    width="90%">
    <div class="content-outer my-scroller" :style="frameStyle">
      <div  v-html="content"></div>
      <div>查看: <a href="javascript:void(0)" @click="showPrivacyAgreementDialog">《可可商城-店铺手机端-隐私协议》</a></div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel">拒绝</el-button>
      <el-button type="primary" @click="confirm">同意</el-button>
    </div>
    <my-privacy-agreement-dialog ref="my-privacy-agreement-dialog" />
  </el-dialog>
</template>

<script>
import MyPrivacyAgreementDialog from './MyPrivacyAgreementDialog'
export default {
  name: 'MyAppAgreementDialog',
  components: {MyPrivacyAgreementDialog},
  data:function () {
    return {
      dialogVisible:false,
      content:'',
      frameStyle:{
        width:'95%',
        height:(this.getWinSize().height-200-55)+'px'
      }
    }
  },
  methods:{
    showPrivacyAgreementDialog:function () {
      this.$refs['my-privacy-agreement-dialog'].open(true)
    },
    open:function () {
      this.getContent()
    },
    getContent:function () {
      let $this=this
      $this.MyRequest($this.ApiDoNameCommon+'Public/appAgreementShop',{type:'json'},function (data) {
        $this.content=data
        $this.dialogVisible=true
        $this.$forceUpdate()
      })
    },
    // 取消后关闭应用
    cancel:function () {
      let $this=this
      $this.$message.warning('拒绝App使用协议,2秒后关闭应用')
      setTimeout(function () {
        if (typeof plus!=='undefined'){
          plus.runtime.quit(); //退出应用
        }
      },2000)
    },
    confirm:function () {
      localStorage.setItem("AppAgreement","1")
      let $this=this
      this.$message.success('您选择【同意协议】,稍后重载应用..')
      $this.bus.$emit('AppAgreementCallBus')
      setTimeout(function () {
        $this.dialogVisible=false
        // location.reload()
      },1000)
      // this.$forceUpdate()
    }
  }
}
</script>

<style scoped>
  .content-outer{
    line-height: 20px; font-size: 12px; text-align: left; text-indent: 20px; overflow-y: auto; overflow-x:hidden
  }
</style>
